'use client'
import { Card, Button } from 'flowbite-react'
import { FaBook, FaGraduationCap } from 'react-icons/fa'
import Link from 'next/link'
import PageContainer from '@/components/PageContainer'
import AnkiIntro from '@/components/AnkiIntro'
export default function HomePage() {
  return (
    <PageContainer>
      <div className="max-w-4xl mx-auto text-center py-12">
        <h1 className="text-4xl font-bold text-gray-900 mb-6">
          欢迎使用 Anki 记忆卡片
        </h1>
        {/* <p className="text-xl text-gray-600 mb-12">
          使用科学的间隔重复方法，提高学习效率
        </p> */}
        <AnkiIntro />
        <div className="grid md:grid-cols-2 gap-6">
          <Card>
            <div className="text-center">
              <FaBook className="text-4xl text-blue-500 mx-auto mb-4" />
              <h2 className="text-xl font-bold mb-4">管理卡片</h2>
              <p className="text-gray-600 mb-6">
                创建和管理您的学习卡片组
              </p>
              <Button as={Link} href="/anki/decks" color="blue">
                开始管理
              </Button>
            </div>
          </Card>

          <Card>
            <div className="text-center">
              <FaGraduationCap className="text-4xl text-green-500 mx-auto mb-4" />
              <h2 className="text-xl font-bold mb-4">开始学习</h2>
              <p className="text-gray-600 mb-6">
                使用间隔重复方法进行学习
              </p>
              <Button as={Link} href="/anki/study" color="green">
                立即学习
              </Button>
            </div>
          </Card>

          <div className="text-center">
            <p className="text-gray-600 mb-6">
              开始创建您的第一个卡片组，体验科学高效的学习方式
            </p>
          </div>
        </div>
      </div>
    </PageContainer>

  )
}